Solving container queries today

Speaker:

Greg Whitworth

Edition:

CSS Day 2018 + UX Special

Date:

2018-06-15

Venue:

Compagnietheater

Container queries (a.k.a. element queries) are a concept that behave like CSS media queries, but rather than only changing styles based on the conditions of the viewport; allow them to change based on the size of the container. The request for container queries from web developers and designers seems to be everywhere. Why then, for something that is so commonly requested, not being solved? Or isn't it…? In this talk we'll explore the problem space that CSS based container queries creates for browsers due to the architecture of the pipeline. More importantly, we'll utilize some newer JS APIs and clever CSS techniques to solve container query use cases - because is it really the width that we want to trigger the query on?

Presentation slidesPresentation Video